<template>
  <div class="body">
    <div class="row">
      <div
        class="col-md-6"
        v-for="(item,index) in homeList[catId]"
        :key="index+'_b'"
      >

        <router-link
          v-if="index < 2"
          :title="item.title"
          target="_blank"
          class="d-block mb-3"
          :to="'show/' + item.id"
          :style="(item.create_time - todayTime) > 0 ?'color:#007bff':''"
        >
          <div class="news-title"><strong>{{item.title}}</strong></div>
          <div class=" d-flex">
            <img
              v-if="item.thumb"
              class="mr-3 flex-shrink-0"
              v-lazy="domain+item.thumb"
              :key="item.thumb"
            >
            <div
              class="abstract"
              v-html="item.description"
            ></div>
          </div>
        </router-link>

        <router-link
          v-if="index > 1"
          :title="item.title"
          :to="'show/' + item.id"
          target="_blank"
          class="news-title"
          :style="(item.create_time - todayTime) > 0 ?'color:#007bff':''"
        >
          {{item.title}}
        </router-link>

      </div>
    </div>
  </div>
</template>
<script>
import { mapState, mapActions } from 'vuex'
export default {
  data () {
    return {
      domain: process.env.VUE_APP_baseURL
    }
  },
  created () {
    this.homeListInit(this.catId);
    this.setTodayTime();
  },
  props: ['catId', 'indexkey'],
  methods: {
    ...mapActions('news', ['homeListInit', "setTodayTime"])
  },
  computed: {
    ...mapState('news', ['homeList', 'todayTime'])

  }

}
</script>

